html,body{
    height: 98%
}
#magicalDragScene{
    height: 95%;
    /*width: 97%;*/
    /*position: absolute;*/
    /*跟节点 不改颜色*/
    background-color:#eee!important;
    border: 2px dashed #eee !important;
}
#iframeBody{
    /*跟节点 不改颜色*/
    background-color:#eee!important;
    border: 2px dashed #eee !important;
}

.inner_iframe {
    /*min-height: 800px;*/
/*    height: 100%;
    width: 100%;*/
    background-color:#eee!important;
    color:#666!important
}

/*当拖拽的时候，把之前隐藏的元素*/
.magicalcoder-dragging .drag-mc-pane{
	border: 1px solid #c9cadd;
	padding: 12px;
	min-width: 5px;
	min-height: 60px;/*保证内部有高度方便其他控件拖入*/
	margin-top:5px;
}
/*拖拽期间 隐藏掉li的点样式*/
.magicalcoder-dragging li,li.magicalcoder-page-drag-item-label {list-style-type:none;}
/*表格显示的很小*/
.magicalcoder-dragging td.drag-mc-pane{
    padding: 20px;
}
/*绝对定位样式优化 */
/*本身别有padding 别有margin否则子元素对不齐*/
.magicalcoder-dragging .magical-coder-layui-absolute-pane.drag-mc-pane{
    padding: 0px!important;
    margin-top:0px!important;
}
/*他的孩子都不用margin它 否则也对不齐*/
.magicalcoder-dragging .magical-coder-layui-absolute-pane .drag-mc-pane{
    margin-top:0px!important;
}
/*临时包裹标签*/
.magicalcoder-dragging span.magicalcoder-tmp-wrap,.magicalcoder-dragging span.magical-coder-layui-tmp-pane{
	padding: 5px;
	border: 1px solid #c9cadd;
	display: inline-block;/*这样拖拽的时候就能让span的宽 高生效了*/
}
.magicalcoder-dragging  div.magicalcoder-tmp-wrap,.magicalcoder-dragging  div.magical-coder-layui-tmp-pane{
	padding: 5px;
	border: 1px solid #c9cadd;
	display: block;/*这样拖拽的时候就能让span的宽 高生效了*/
}
/*中间面板重新layui 保证好选择 容易操作*/
 table{
    border: 10px !important;
}
 /*自定义的表格样式 视图区域显示列*/
.magicalcoder-dragging .magicalcoder-table-th{
    display: inline-block;
}
/*自定义的表格样式 预览区域隐藏列*/
.magicalcoder-table-th{
    display: none;
}

/*拖拽时 缩小下区域 容易放置*/
.drag-view{
	overflow: hidden;/*超出区域隐藏 体验更好了*/
	background-color: #24292E !important;;
	background: #24292E !important;;
	border: 1px dashed #307AFF !important;;
	padding:0px !important;/*临时把drag-mc-pane设置失效 否则表现跟大家不一样*/
	width:15px !important;;
	height: 15px !important;
	min-width: 15px !important;;
	min-height: 15px !important;;
	max-width: 15px !important;;
	max-height: 15px !important;;
	opacity: 1 !important;;
	z-index: 999999999 !important;;/*最前置顶 不可删除*/
    display: inline-block;
}
.magical-drag-drop-chosen{
    /*display: inline-block;*/
}

.sortable-drag{
    opacity: 1 !important;
    border:1px solid #40474E !important;
}
/*重新layui样式 太窄了 加上边框后 修复聚焦后 宽会超出 换行了*/
.layui-form-label{
    width:78px;
}
/*===============工作台 end    ==============*/

/*左侧内容拖拽到中间区域 把文字隐藏*/
 .magicalcoder-page-drag-item-label>a{
	display: none;
}
.magicalcoder-hide{
	 display: none !important;
}


/*统一强制样式操作 优先级最高*/
/*想要样式强制生效 选这个*/
.magicalcoder-focus-border{
	border: 1px dashed #409eff !important;
}
.magicalcoder-focus-parent-border{
	border: 2px dashed #ffdb3f !important;
}
.magicalcoder-focus-parent-not-allow-border{
	border: 2px dashed #dbe0ff !important;
    animation: fade 600ms infinite;
    -webkit-animation: fade 600ms infinite;
}
/*td 1px不行*/
td.magicalcoder-focus-border,
th.magicalcoder-focus-border,
tr.magicalcoder-focus-border,
table.magicalcoder-focus-border{
	border: 2px dashed #409eff !important;
}


/*缩放*/
.magicalcoder-zoom{
    max-height: 100px;
    min-height: 40px;
    background-color:#cfc7c7;
}
.magicalcoder-zoom::after{
    content: "缩放状态";
    /*background-color: #F5F5F5;*/
    border-radius: 4px 0 4px 0;
    color: #9DA0A4;
    font-size: 12px;
    font-weight: bold;
    right: -1px;
    line-height:2;
    /*padding: 3px 7px;
    position: absolute;*/
    /*top: -1px;*/
}
.magicalcoder-zoom div{
    display:none;
}
.magicalcoder-zoom span{
    display:none;
}
.magicalcoder-zoom form{
    display:none;
}
.magicalcoder-zoom label{
    display:none;
}
.magicalcoder-zoom ul{
    display:none;
}
.magicalcoder-zoom li{
    display:none;
}
.magicalcoder-zoom ol{
    display:none;
}
.magicalcoder-zoom table{
    display:none;
}
.magicalcoder-zoom tbody{
    display:none;
}
.magicalcoder-zoom thead{
    display:none;
}
.magicalcoder-zoom tfoot{
    display:none;
}
.magicalcoder-zoom tr{
    display:none;
}
.magicalcoder-zoom td{
    display:none;
}
.magicalcoder-zoom th{
    display:none;
}
/*form*/
.magicalcoder-zoom button{
    display:none;
}
.magicalcoder-zoom input{
    display:none;
}
.magicalcoder-zoom textarea{
    display:none;
}
.magicalcoder-zoom select{
    display:none;
}
.magicalcoder-zoom a{
    display:none;
}
.magicalcoder-zoom img{
    display:none;
}
.magicalcoder-zoom i{
    display:none;
}
.magicalcoder-zoom blockquote{
    display:none;
}
.magicalcoder-zoom hr{
    display:none;
}
.magicalcoder-zoom pre{
    display:none;
}
.magicalcoder-zoom code{
    display:none;
}

/*定义chrome滚动条样式*/
::-webkit-scrollbar {/*滚动条整体样式*/
    width: 6px;     /*高宽分别对应横竖滚动条的尺寸*/
    height: 6px;
}
::-webkit-scrollbar-thumb {/*滚动条里面小方块*/
    border-radius: 3px;
   /* -webkit-box-shadow: inset 0 0 5px rgba(0,0,0,0.2);*/
    background-color: #4E565D;
}
::-webkit-scrollbar-track {/*滚动条里面轨道 根据背景色自适应*/
    /*-webkit-box-shadow: inset 0 0 5px rgba(0,0,0,0.2);*/
    border-radius: 3px;
    /*background-color: #24292E;*/
}
/*定义ie滚动条样式*/
body{
    /*三角箭头的颜色*/
    scrollbar-arrow-color: #4E565D;
    /*滚动条滑块按钮的颜色*/
    scrollbar-face-color: #4E565D;
    /*滚动条整体颜色*/
    /*scrollbar-highlight-color: #333;*/
    /*滚动条阴影*/
    scrollbar-shadow-color: #24292E;
    /*滚动条轨道颜色*/
    scrollbar-track-color: #24292E;
}

/*扩展配置里面的图标*/
.magicalcoder-extend-icons{margin-bottom: 50px; font-size: 0;}
.magicalcoder-extend-icons li{display: inline-block; vertical-align: middle; width: 60px; height: 30px; line-height: 25px; padding: 20px 0; margin-right: -1px; margin-bottom: -1px; border: 1px solid #e2e2e2; font-size: 14px; text-align: center; color: #666; transition: all .3s; -webkit-transition: all .3s;}
.site-doc-anim li{height: auto;}
.magicalcoder-extend-icons li i{display: inline-block; font-size: 36px;cursor: pointer}

.magicalcoder-extend-icons li:hover{background-color: #f2f2f2; color: #000;}
.magicalcoder-extend-icons i.active{
    color: #307AFF;
}

